<template>
	<view class="" style="padding: 30rpx;">
		<shopro-empty v-if="activitydata.length==0" :image="$IMG_URL + '/imgs/empty/empty_goods.png'" tipText="暂无列表，敬请期待..."></shopro-empty>
		<view class="padding-bottom flex flex-direction" v-for="(item, index) in activitydata" :key="index" @click="jumpp(item)">
			<image :src="img + item.image" mode="aspectFill" class="  w690 h360 r10 bg-gray "></image>
			<view class="flex align-center justify-between mt25">
				<text class="f28 text-bold ">{{ item.title }}</text>
				<view class="sgnUp">{{signingUp(item.start_time ,item.end_time)}}</view>
			</view>
			<view class="flex align-center ">
				<text class="f24 " style="color: #666666;">
					活动时间{{ item.start_time_text }} {{ item.end_time_text }}
				</text>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			img: 'https://guoxue.qianjiwl.xyz',
			activitydata: []
		};
	},
	onLoad(e) {
		this.activity();
		uni.setNavigationBarColor({
			backgroundColor: '#8F3333',
			frontColor: '#FFFFFF'
		});
	},
	methods: {
		async jumpp(e){
			uni.setStorageSync('content' ,e)
			 uni.navigateTo({
			 	url: '/pages/start/evntDetails',
			 });
		},
		async activity() {
			let that = this;
			const res = await that.$http('common.activity', { page: 1, limit: 10 });
			this.activitydata = res.data;
			console.log('res11 :>> ', res);
		},
		signingUp(e,e1){
			 console.log('e :>> ', e);
			 console.log('e1 :>> ', e1);
			 console.log('Math.round(new Date() / 1000) :>> ', Math.round(new Date() / 1000));
			 var time = Math.round(new Date() / 1000)
			 if (e < time &&  time <  e1 ) {
			 	return '活动中'
			 }
			 if (time < e  ) {
			 	return '报名中'
			 }
			 if (time > e1  ) {
			 	return '已结束'
			 }
		},
	}
};
</script>

<style>
	.txtClr {
		color: #4d4d4d;
	}
	.horzLine {
		width: 750rpx;
		height: 20rpx;
		background: #f0f0f0;
	}
	.sgnUp {
		padding: 13rpx 19rpx;
		border: 2rpx solid #d76363;
		border-radius: 4rpx;
		font-size: 26rpx;
		font-weight: 500;
		color: #d76363;
	}
	.bgimg {
		position: absolute;
		top: 50rpx;
		right: 0;
	}
</style>
